import React from 'react'
import { Form, Input, Button, Checkbox } from 'antd';
const layout = {
  labelCol: {
    span: 8,
  },
  wrapperCol: {
    span: 16,
  },
};
const tailLayout = {
  wrapperCol: {
    offset: 8,
    span: 16,
  },
};

const onFinish = (values) => {
  console.log('Success:', values);
};

const onFinishFailed = (errorInfo) => {
  console.log('Failed:', errorInfo);
  // message.error('你没有通过校验,不能登录')
};
class App extends React.Component{
  render(){
    return <div>
      <Form
    {...layout}
    name="basic"
    initialValues={{
      remember: true,
    }}
    onFinish={onFinish}
    onFinishFailed={onFinishFailed}
  >     
  {/* 用户名 */}
    <Form.Item
      label="用户名"
      name="username"
      rules={[
        {
          required: true,
          message: 'Please input your username!',
        },
      ]}
    >
      <Input />
    </Form.Item>
        {/* 密码 */}
    <Form.Item
      label="Password"
      name="password"
      rules={[
        {
          required: true,
          message: 'Please input your password!',
        },
      ]}
    >
      <Input.Password />
    </Form.Item>
        {/* 记住我 */}
    <Form.Item {...tailLayout} name="remember" valuePropName="checked">
      <Checkbox>记住我</Checkbox>
    </Form.Item>

    <Form.Item {...tailLayout}>
      <Button type="primary" htmlType="submit">
        登录
      </Button>
    </Form.Item>
  </Form>
    </div>
}
}
export default App

// import React from 'react'
// class App extends React.Component{
//   render(){
//     return <div>
//       123
//     </div>
//   }
// }
// export default App